/*
 * @Author: Jimmy
 * @LastModifiedBy: Jimmy
 * @Date: 2024-06-23 12:37:05
 * @LastEditTime: 2024-06-30 18:37:22
 * @FilePath: /nest_study/web/src/views/system/role/components/info.tsx
 */

import DrawerWrapper from "@/components/drawer_wrapper"
import { Form, Input, InputNumber, message } from "antd"
import { TRoleInfo } from "../index.type";
import { useEffect, useState } from "react";
import { addInfo, updateInfo } from "@/api/system/role";
import { rules } from "./rules";
import AuthMenuTree from "@/components/auth_menu_tree";

const ShowInfo = (props: any) => {
    let { info } = props;
    let initForm: TRoleInfo = {
        name: '',
        code: '',
        sort: 0,
        remark: '',
    }
    const [form] = Form.useForm<any>();
    const [infoForm, _setInfoForm] = useState<TRoleInfo>({ ...initForm, ...info });
    const [checkIds, setCheckedIds] = useState<Array<number>>([]);
    const [allKeys, setAllKeys] = useState<Array<any>>()
    useEffect(() => {
        if (info?.id) {
            setCheckedIds(info.menuIds)
        }
    }, [])
    //提交
    const submit = async () => {
        form.validateFields().then(async values => {
            let info = { ...infoForm, ...values };
            info.menuIds = allKeys;
            if (info.id) {
                await updateInfo(info);
            } else {
                await addInfo(info);
            }
            message.success('操作成功');
            form.resetFields();
            props.submit();
        }).catch(info => {
            console.log('Validate Failed - ', info);
        });
    }
    return (
        <DrawerWrapper
            title="角色信息"
            close={() => props.close()}
            submit={() => submit()}
        >
            <Form
                form={form}
                name="info"
                labelCol={{ span: 5 }}
                wrapperCol={{ span: 17 }}
                initialValues={{ remember: false }}
                onFinish={submit}
                autoComplete="off"
            >
                <Form.Item label="角色编码" initialValue={infoForm.code} name="code" rules={rules.code}>
                    <Input allowClear disabled={infoForm?.id ? true : false} placeholder="请输入角色编码" />
                </Form.Item>
                <Form.Item label="角色名称" initialValue={infoForm.name} name="name" rules={rules.name}>
                    <Input allowClear placeholder="请输入角色名称" />
                </Form.Item>

                <Form.Item label="菜单权限" initialValue={infoForm.menuIds} name="menuIds">
                    <AuthMenuTree ids={checkIds} select={(all: any[]) => setAllKeys(all)} />
                </Form.Item>
                <Form.Item label="排序" initialValue={infoForm.sort} name="sort" rules={rules.sort}>
                    <InputNumber min={0} precision={0} style={{ width: '100%' }} placeholder="请输入排序" />
                </Form.Item>
                <Form.Item label="备注" initialValue={infoForm.remark} name="remark">
                    <Input.TextArea placeholder="请输入备注" />
                </Form.Item>
            </Form>
        </DrawerWrapper>
    )
}

export default ShowInfo